﻿@using System.Web.Script.Serialization
@{
    ViewBag.Title = T("Admin.ProductVariant.Edit.Title");
    Layout = "~/views/shared/_AdminLayout.cshtml";
}

<h4>@T("Admin.ProductVariant.Edit.Title")</h4>

@Html.Partial("ManageProductVariantMenu")
<div class="tab-content">
    <div class="tab-pane active" id="pvInfo">
        @Html.Partial("_ProductVariantInfo_CreateOrEdit")
    </div>
    <div class="tab-pane" id="pva">
        @Html.Partial("_ProductVariantAttribute_List")
    </div>
</div>






   
@Styles.Render("~/content/fineuploader/fineuploader-3.5.0.css")
    @Scripts.Render("~/content/fineuploader/fineuploader-3.5.0.js")
    @Scripts.Render("~/content/fineuploader/iframe.xss.response-3.5.0.js")


@{
    var model = ViewBag.Model;
    var jsonStr = new HtmlString(new JavaScriptSerializer().Serialize(model));
}

@section scripts
{
    
    <script>
        $(function() {
            $('#myTab a[href="#@ViewBag.Tab"]').tab('show');
        })
    </script>


    <script>
        var init = @jsonStr;

        function ProductVariantAttribute(id, pname, actName) {
            this.Id = ko.observable(id);
            this.ProductAttributeName = ko.observable(pname);
            this.AttributeControlTypeName = ko.observable(actName);
        }

        function AttributeControlType(controlTypeName, controlTypeValue) {

            this.ControlTypeName = ko.observable(controlTypeName);
            this.ControlTypeValue = ko.observable(controlTypeValue);

        }

        function ProductVariantModel() {
            var self = this;
            self.Id = ko.observable(init.Id);
            self.Name = ko.observable(init.Name).extend({
                required: { message: '@T("Admin.ProductVariant.NeedName")' },
                maxLength: 400
            });
            self.Price = ko.observable(init.Price).extend({
                number: { message: '@T("Admin.ProductVariant.PriceFormatError")' }
            });
            self.Sku = ko.observable(init.Sku);
            self.DisplayOrder = ko.observable(init.DisplayOrder).extend({
                digit: { message: '@T("Admin.ProductVariant.DisplayOrderFormatError")' }
            });
            self.StockQuantity = ko.observable(init.StockQuantity).extend({
                digit: { message: '@T("Admin.ProductVariant.StockQuantityFormatError")' }
            });
            self.PictureId = ko.observable(init.PictureId).extend({
                notEqual: { message: '@T("Admin.ProductVariant.NeedPicture")', params: 0 }
            });
            self.PictureUrl = ko.observable(init.PicUrl);
            self.Published = ko.observable(init.Published);
            self.ProductId = ko.observable(init.ProductId);


            var attributeList = $.isEmptyObject(init.ProductVariantAttributes) ? [] : $.map(init.ProductVariantAttributes, function(a) {
                return new ProductVariantAttribute(a.Id, a.ProductAttributeName, a.AttributeControlTypeName);
            });

            self.ProductVariantAttributes = ko.observableArray(attributeList);

            var cts = $.isEmptyObject(init.AttributeControlTypes) ? [] : $.map(init.AttributeControlTypes, function(a) {
                return new AttributeControlType(a.ControlTypeName, a.ControlTypeValue);
            });

            self.AvailableAttributeControlTypes = ko.observableArray(cts);


            self.SaveProductVariantInfo = function() {
                $.ajax({
                    url: "/api/ProductVariantApi/UpdateProductVariantInfo",
                    type: 'post',
                    data: ko.toJSON(self),
                    contentType: 'application/json',
                    success: function(result) {

                        if (result.Status == "0") {
                            toastr.success(result.Message);
                            //location.href = '/admin/ProductVariant/Edit?productVariantId=' + self.Id();
                        } else {
                            toastr.error(result.Message);
                        }
                    }
                });
            };
            
            
            self.DeleteProductVariantAttribute = function(p) {
                if (confirm('@T("admin.productvariantattribute.delete.confirm")')) {
                    var data = {
                        ProductvariantattributeId: p.Id()
                    };
                    $.ajax({
                        url: "/api/ProductVariantAttributeApi/DeleteProductVaraintAttribute",
                        type: 'post',
                        data: ko.toJSON(data),
                        contentType: 'application/json',
                        success: function(result) {

                            if (result.Status == "0") {
                                self.ProductVariantAttributes.remove(p);
                                toastr.success(result.Message);
                            } else {
                                toastr.error(result.Message);
                            }
                        }
                    });
                }
                
            };

        }

        var vm = new ProductVariantModel();
        ko.applyBindings(vm);        

        
        $(document).ready(function() {

            var errorHandler = function(event, id, fileName, reason) {
                qq.log("id: " + id + ", fileName: " + fileName + ", reason: " + reason);
            };


            var uploader2 = new qq.FineUploader({
                element: $('#manualUploadModeExample')[0],
                autoUpload: true,
                uploadButtonText: "Select Files",
                request: {
                    endpoint: "/FineUploader/UploadFile",
                    params: { "extraParam1": "true", "picSize": "100" }
                },
                callbacks: {
                    onError: errorHandler,
                    onComplete: function(id, fileName, responseJSON) {
                        if (responseJSON.success) {
                            vm.PictureId(responseJSON.OriginalPictureId);
                            vm.PictureUrl(responseJSON.NewPictureUrl);
                        }
                    }
                }
            });
        });
    </script>
}
